<template>
	<view>
		<cu-custom :isBack="true" style="color: #fff;" bgColor="bg-gradual-fff">
			<block slot="content" style="color: #fff;">情欲蓝图</block>
		</cu-custom>
		<u-loading-page :loading="true" loading-text="loading..." v-if="showLoading"></u-loading-page>
		<view v-show="!showLoading">
			<view class="viewbox" style="background-color:#0B000C;"></view>
				
				
				<view class="pay">
					<view class="money">
						<view class="t1">￥</view>
						<view class="t2">3.5</view>
						<view class="t3">+</view>
						<view class="t4">积分</view>
						<view class="t5">56</view>
					</view>
					
					<!-- <navigator url="/pages/test_center/pay"><button class="btn">查看解读报告</button></navigator> -->
					
					<view class="a">
						<u-modal
							:show="show" 
							@confirm="confirm" 
							confirmColor="#BC82BB" 
							cancelColor="#BC82BB" 
							:title="title" 
							:content="content" 
							ref="uModal" 
							:showCancelButton="true" 
							:asyncClose="true">
						</u-modal>
						<button class="btn" @click="show = true">查看解读报告</button>
					</view>
						
					
				</view>
				
		</view>	
	</view>
</template>
<script>
	export default{
		data(){
			return{
				show:false,
				title:'查看解读报告',
				content:'需要付费才能查看解读报告'
			}
		},
		methods:{
				showModal() {
					this.show = true;
				},
				confirm() {
					setTimeout(() => {
						// 3秒后自动关闭
						this.show = false;
					}, 3000)
				}
		    }
	}
</script>

<style  lang="scss" scoped>
	
	
	.pay{
		width: 750rpx;
		height: 120rpx;
		background: #FFFFFF;
		border-radius: 10rpx 10rpx 0rpx 0rpx;
		border: 1px solid #F2F2F2;
		position: fixed;
		bottom: 0rpx;
		display: flex;
	}
	.money{
		position: absolute;
		display: flex;
		height: 30rpx;
		// border: #62469B 1rpx solid;
		margin-top: 41rpx;
		margin-left: 51rpx;
	}
	.t1{
		font-family: PingFang SC;
		font-weight: 500;
		font-size: 30rpx;
		color: #FF6000;
		line-height: 36rpx;
	}
	.t2{
		font-family: PingFang SC;
		font-weight: 500;
		font-size: 36rpx;
		color: #FF6000;
		line-height: 36rpx;
	}
	.t3{
		font-family: PingFang SC;
		font-weight: 500;
		font-size: 30rpx;
		color: #FF6000;
		line-height: 36rpx;
	}
	.t4{
		font-family: PingFang SC;
		font-weight: 500;
		font-size: 30rpx;
		color: #FF6000;
		line-height: 36rpx;
	}
	.t5{
		font-family: PingFang SC;
		font-weight: 500;
		font-size: 36rpx;
		color: #FF6000;
		line-height: 36rpx;
	}
	.btn{
		position: absolute;
		margin-left: 390rpx;
		margin-top: 16rpx;
		
		width: 330rpx;
		height: 88rpx;
		background: #62469B;
		border-radius: 44rpx;
		
		font-family: PingFang SC;
		font-weight: 500;
		font-size: 30rpx;
		color: #FFFFFF;
		line-height: 90rpx;
	}
</style>
